<!--显示全部的或分组成员-->
#include('head.html',{title:'所有成员信息'})
<style>
  @media (min-width: 768px){
    .app, .app body {
      height: 100%;
      overflow: auto!important;
    }
  }
</style>
<body class="" >
  <section class="vbox" >
    #include('header.html')
    <section>
      <section class="hbox stretch">
        <!-- .aside -->
        <aside class="bg-dark dk nav-xs aside hidden-print" id="nav">
          #include('list.html')
        </aside>
        <!-- /.aside -->
        <section id="content">
          <section class="vbox">
            <section class="w-f-md" id="bjax-target">
              <section class="hbox stretch">
                <!-- side content -->
                <aside class="aside bg-light dk" id="sidebar">
                  <section class="vbox animated fadeInUp" >
                    <section class="scrollable hover">
                      <div class="list-group no-radius no-border no-bg m-t-n-xxs m-b-none auto">
                        <!--<a href="/search" class="list-group-item" style="text-align: center;">-->
                          <!--<i class="icon-magnifier icon text-primary-lter"></i>&nbsp;&nbsp;&nbsp;成员搜索-->
                        <!--</a>-->
                        <a href="#" class="list-group-item active" >
                          所有成员信息
                        </a>
                        #set(i=0)
                        #for(Group group :groupsname)
                        <a href="../memberInfor/${i+1}" class="list-group-item" >
                          ${group.g_gname}成员信息
                        </a>
                        #set(i=i+1)
                        #end
                        <a href="/allMember/period/${year-2015}" class="list-group-item" >各届成员信息</a>
                      </div>

                    </section>
                  </section>
                </aside>
                <!-- / side content -->
                <section>
                  <section class="vbox" >
                    <section class="scrollable padder-lg">
                      <h2 class="font-thin m-b">成员信息列表</h2>
                      <div class="row row-sm">
                        #set(i=0)
                        #for(Users user : result.getRows())
                        <div class="col-xs-6 col-sm-4 col-md-3 col-lg-2"  >
                          <div class="item">
                            <div class="pos-rlt">
                              <div class="bottom">
                                <span class="badge bg-info m-l-sm m-b-sm">
                                  #if(user.m_studentNumber)
                                  ${user.m_studentNumber.substring(0,4)}级
                                  #else
                                  null
                                  #end
                                </span>
                              </div>
                              <div class="item-overlay opacity r r-2x bg-black">
                                <div class="center text-center m-t-n">
                                  <a href="/users/${user.m_id}" target="_blank"><i class="fa fa-play-circle i-2x"></i></a>
                                </div>
                              </div>
                              <a href="/users/${user.m_id}" target="_blank" ><img src="/static/upload/img/${user.m_headPortrait}" id="img" class="r r-2x img-full"></a>
                            </div>
                            <div class="padder-v">
                              <a href="/users/${user.m_id}" target="_blank" data-bjax data-target="#bjax-target" data-el="#bjax-el" data-replace="true" class="text-ellipsis">${user.m_realname}</a>
                              <p>${groups1[i].g_gname}</p>
                            </div>
                          </div>
                        </div>
                        #set(i=i+1)
                        #end
                      </div>
                      <!--导航栏-->

                      <div class="text-center">
                        <ul class="pagination pagination text-center">
                          <li><a href="/allMember/all/1?pageNow=${result.pageNum-1 > 0 ? result.pageNum-1 : 1 }"><i class="fa fa-chevron-left"></i></a></li>
                          #for(int m : range(1, result.totalPages))
                          <li class="${m == result.pageNum  ? 'active':''}"><a href="/allMember/all/1?pageNow=${m}">${m}</a></li>
                          #end

                          <li><a href="/allMember/all/1?pageNow=${result.pageNum+1 > result.totalPages ? result.totalPages : result.pageNum+1}"><i class="fa fa-chevron-right"></i></a></li>
                        </ul>
                      </div>
                    </section>                    
                  </section>
                </section>

            </section>
            #include('footer.html')

          </section>
          <a href="#" class="hide nav-off-screen-block" data-toggle="class:nav-off-screen,open" data-target="#nav,html"></a>
        </section>
      </section>
    </section>    
  </section>
  <script>
      new Vue({
          el : '#app'
      });
  </script>
#include('js.html')
<script>
  <!--解决因用户头像存在细微差异导致的排版错乱问题-->
  var height = $("#img").width()*1.4;
  $("img#img").css("height",height);
  console.log(height);
</script>
</body>
</html>